<template>
  <div class="box">
    <div class="replyMessage">
      <p>请描述您所遇到的问题</p>
      <van-field
        v-model="form.content"
        class="question"
        name="content"
        rows="4"
        autosize
        type="textarea"
        maxlength="100"
        input-align="left"
        placeholder="请您详细填写相关动物病情、时间、部位，使用兽药情况等，便于转诊给最适合的专家。"
      />
      <div class="spacing" />
      <div style="background: #fff; padding: 10px 20px">
        <p class="col-333 font-15" style="margin-bottom: 5px">若有图片，更能清晰的反应问题：</p>
        <UploadImg v-model="imgs"></UploadImg>
        <div class="tip">注：支持格式JPG、JPEG、PNG，最多上传5张照片，单个不超过5M。</div>
      </div>
    </div>
    <div class="add-btn">
      <van-button
        block
        type="info"
        color="#37B5B5"
        style="width: 85%; margin: 45px auto"
        @click="onSave"
        size="large"
        :loading="loading"
        loading-text="提交中..."
        >保存</van-button
      >
    </div>
  </div>
</template>
<script>
import { Dialog, Toast, Icon, Cell, Picker, Popup, Field, Button } from 'vant'
import { getValue, clearValue, setValue } from '@/utils/auth'
import { businessData4Amis, ystw } from '@/api/record'
import UploadImg from '../../components/uploadImg'
import { getHandle, postHandle } from '@/api'
export default {
  components: {
    [Icon.name]: Icon,
    [Toast.name]: Toast,
    [Cell.name]: Cell,
    [Picker.name]: Picker,
    [Popup.name]: Popup,
    [Button.name]: Button,
    [Dialog.Component.name]: Dialog.Component,
    [Dialog.name]: Dialog,
    [Field.name]: Field,
    UploadImg
  },
  data() {
    return {
      showProblem: false,
      problemList: [],
      imgs: [],
      form: {
        tenantCode: getValue('tenantCode'),
        subjectInfoId: getValue('subjectInfoId'),
        content: '', // 问题内容
        uploadImgs: '', // 问题图片
        subjectExpertInfoId: JSON.parse(getValue('expert-detail-obj')).id,
        consultationMode: 0
      },
      loading: false
    }
  },

  created() {},
  methods: {
    onSave() {
      if (!this.form.content) {
        Toast('请输入问题')
        return
      }
      this.loading = true
      this.form.uploadImgs = this.imgs.map(ele => ele.baseUrl).toString()
      postHandle('/agri/api/common/questionInfo/save', this.form).then(res => {
        console.log(res)
        if (res.status === 0) {
          Toast('提问成功')
          this.$bridge.call('base.closePage')
        } else {
          Toast(res.msg)
        }
        this.loading = false
      })

      // this.$bridge.call('editExpertInfo')
    }
  }
}
</script>
<style lang="scss" scoped>
.van-cell::after {
  border-bottom: 1px solid #fff;
}
.question {
  padding: 5px 16px;
  margin-bottom: -2px;
}
::v-deep .van-field__body {
  border: 1px solid #eeeeee;
  padding: 8px;
  border-radius: 4px;
}
.replyMessage {
  padding-top: 5px;
  background-color: #fff;
  > p {
    padding: 10px 16px 5px;
    color: #333333;
    font-size: 15px;
  }
}
.tip {
  color: #999999;
  font-size: 12px;
  margin-top: 6px;
}
.add-btn {
  padding-bottom: 20px;
}
</style>
